<template>
	<view>
		<view style="height: 160rpx;box-sizing:border-box;background-color: #fff; padding-top: 81rpx;border-bottom: 2rpx solid #F7F7F7;display: flex;">
			<image src="/static/shequ/fh.png" @click="backTo()" style="margin: 0 259rpx 0 30rpx; width: 18rpx;height: 32rpx;" mode="aspectFit"></image>
			<text style="font-size: 32rpx;">设置</text>
		</view>
		<view class="content1">
			<view class="item">
				<label>头像</label>
				<view style="display: flex;flex-direction: row;align-items: center;">
					<image :src="touxiang" style="width: 57rpx;height: 57rpx;border-radius: 50%;"></image>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
			<view class="item">
				<label>昵称</label>
				<view>
					<text>{{nickName}}</text>
				    <image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
			<view class="item">
				<label>性别</label>
				<view>
					<text>男</text>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
		</view>
		<view class="content2">
			<view class="item">
				<label>修改密码</label>
				<view>
					<text>张三</text>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
			<view class="item">
				<label>消息通知</label>
				<view>
					<text>开启</text>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
		</view>
	    <view class="content3">
			<view class="item">
				<label>绑定微信</label>
				<view>
					<text>125588aax</text>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
			<view class="item">
				<label>绑定支付宝</label>
				<view>
					<text>12345678910</text>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
			<view class="item">
				<label>手机号绑定</label>
				<view>
					<text>12345678910</text>
					<image src="@/static/jiantou.png" class="jiantou"></image>
				</view>
			</view>
		</view>
	    <view class="footer">
			<text>退出登录</text>
		</view>
	</view>
</template>
<script>
	import {Storage} from '@/static/libs/utils.js'
export default {
	data(){
		return {
			touxiang:'',
			nickName:'',
			gender:''
		}
	},
	onLoad(){
		this.touxiang = Storage.get('avatarUrl')
		this.nickName = Storage.get('nickName')
	},
	methods:{

	}
}
</script>
<style lang="scss">
page {
	background: rgb(245, 245, 245);
}
.content1 {
	width: 100%;
	height: 274rpx;
	background: #FFFFFF;
}
.item {
	width: 690rpx;
	height: 90rpx;
    line-height: 90rpx;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding-left: 30rpx;
	padding-right: 30rpx;
	border-top: 2rpx solid #E5E5E5;
	font-family: Source Han Sans CN;
	font-weight: 400;
	label {
		font-size: 30rpx;
		color: #1B1B1B;
	}
	text {
		font-size: 26rpx;
		color: #999999;
	}
}
.jiantou {
	width: 13rpx;
	height: 23rpx;
	margin-left: 15rpx;
}
.content2 {
	width: 100%;
	height: 182rpx;
	margin-top: 20rpx;
	background: #FFFFFF;
}
.content3 {
	width: 100%;
	height: 274rpx;
	margin-top: 20rpx;
	background: #FFFFFF;
}
.footer {
	font-size: 28rpx;
	font-family: Source Han Sans CN;
	font-weight: 400;
	color: #999999;
	margin-top: 325rpx;
    text-align: center;
}
</style>
